.w {
  width: 1200px;
  /* 块元素 水平居中 */
  margin: 0 auto;
}

/* shortcut 模块开始 */
.shortcut {
  /* 让盒子高度31px */
  height: 31px;
  /* 文字垂直居中 */
  line-height: 31px;
  /* 背景颜色 */
  background-color: #f1f1f1;
}

.shortcut .left {
  float: left;
}

.shortcut .left li {
  float: left;
}

/* 红色文字共有样式 */
.style_red {
  color: #c81623;
}

.shortcut nav {
  float: right;
}

.shortcut nav li {
  float: left;
}

.shortcut nav li a {
  /* 增加a的点击范围· */
  padding: 0 14px;
}

/* 选择偶数的li */
.shortcut nav li:nth-child(2n) {
  width: 1px;
  height: 12px;
  background-color: #666;
  margin-top: 9px;
}

/* shortcut模块结束 */
/* header 模块开始 */
header {
  /* header设置 高度 */
  height: 105px;
  /* 让他的内容距离盒子上边缘有24px距离 */
  padding-top: 24px;
  /* background-color: #8df; */
}

header .logo,
header .search,
header .shopcar {
  float: left;
}

header .logo a {
  /* a是行内元素 */
  display: block;
  width: 171px;
  height: 61px;
  /*
    让文字超出页面范围，超出部分隐藏
    text-indent: -9999px;
    overflow: hidden;
  */
  /* 让文字字体大小变成0 */
  font-size: 0;
  background: url(../images/logo.png) no-repeat;
}

/* 搜索模块 */
.search {
  width: 538px;
  margin-left: 173px;
  /* background-color: green; */
}

.search .search_inp input {
  float: left;
  width: 456px;
  height: 36px;
  border: 2px solid #b1191a;
  /* 右侧边框为空 */
  border-right: none;
  padding-left: 10px;
}

.search .search_inp button {
  float: left;
  width: 82px;
  height: 36px;
  line-height: 36px;
  font-size: 16px;
  color: #fff;
  background-color: #b1191a;
  text-align: center;
}

/* hotwords 热词模块 */
.hotwords {
  margin-top: 8px;
}

.hotwords li {
  float: left;
}

.hotwords li a {
  padding: 0 12px;
}

/* 购物车模块 */
.shopcar {
  position: relative;
  width: 140px;
  height: 36px;
  background-color: #f7f7f7;
  border: solid 1px #dfdfdf;
  text-align: center;
  margin-left: 111px;
  line-height: 36px;
  font-size: 12px;
}

.shopcar::before {
  content: '\e93a';
  color: #d84a4a;
  font-family: 'icomoon';
  margin-right: 7px;
}

.shopcar::after {
  content: '\e920';
  font-family: 'icomoon';
  margin-left: 14px;
}

.shopcar .count {
  position: absolute;
  /* 让文字变多的时候，从左向右延伸 */
  left: 100px;
  top: -4px;
  height: 14px;
  /* 为了让文字在自己的盒子里面 垂直居中 */
  line-height: 14px;
  padding: 0 5px;
  color: #fff;
  background-color: #e60012;
  border-radius: 7px 7px 7px 0;
}

/* header 模块结束 */
/* 主导航 模块开始 */
.nav {
  height: 47px;
  border-bottom: 2px solid #b1191a;
}

.nav .dropdown,
.nav .navitems {
  float: left;
}

.nav .dropdown .dt {
  width: 209px;
  height: 45px;
  color: #fff;
  font-size: 16px;
  text-align: center;
  line-height: 45px;
  background-color: #b1191a;
}

.nav .dropdown .dd {
  /* display: none; */
  width: 209px;
  height: 466px;
  margin-top: 2px;
  background-color: #c81623;
}

.nav .dropdown .dd li {
  height: 31px;
  line-height: 31px;
  padding: 0 10px;
  margin-left: 2px;
}

.nav .dropdown .dd li a {
  font-size: 14px;
  color: #fff;
}

.nav .dropdown .dd li::after {
  float: right;
  content: '\e920';
  color: #fff;
  font-family: 'icomoon';
}

.nav .dropdown .dd li:hover {
  background-color: #fff;
}

.nav .dropdown .dd li:hover a,
.nav .dropdown .dd li:hover::after {
  color: #b1191a;
}

/* navitems 模块 */
.navitems li {
  float: left;
  color: #333;
  font-size: 16px;
}

.navitems li a {
  line-height: 45px;
  /* a的点击范围变大 */
  padding: 0 26px;
}

/* 主导航 模块结束 */
/* footer 模块开始 */
footer {
  height: 417px;
  margin-top: 38px;
  background-color: #f5f5f5;
  /* background-color: #88ddff; */
}

footer .mod_service {
  height: 110px;
  /* 内容与盒子边缘距离 */
  padding-top: 30px;
  /* 下边框 */
  border-bottom: 1px solid #ededed;
}

footer .mod_service li {
  /* 让li在一行显示 */
  float: left;
  width: 200px;
  height: 50px;
  padding-left: 34px;
}

footer .mod_service li h5,
footer .mod_service li div {
  float: left;
}

footer .mod_service li h5 {
  width: 50px;
  height: 50px;
  background: url(../images/icons.png) no-repeat -252px -3px;
}

/* li h5:nth-child(2) {} 找到li里面的的第二个h5 */
/* li:nth-child(2) h5 {} 找到第二个li里面的的h5 */
footer .mod_service li:nth-child(2) h5 {
  /* background: url(../images/icons.png) no-repeat -255px -53px; */
  background-position: -255px -53px;
}

footer .mod_service li div {
  /* 给整体去设置 */
  margin: 7px 0 0 7px;
}

footer .mod_service li div h3 {
  font-size: 14px;
  line-height: 14px;
  color: #333;
}

footer .mod_service li div p {
  font-size: 12px;
  line-height: 12px;
  margin-top: 9px;
}

/* 帮助模块 */
footer .mod_help {
  height: 188px;
  padding-top: 21px;
  border-bottom: 1px solid #ededed;
}

footer .mod_help dl {
  float: left;
  width: 200px;
}

footer .mod_help dl:first-child {
  margin-left: 48px;
}

footer .mod_help dl:last-child {
  width: 95px;
  /* 最后一个dl 内部文字是水平居中的 */
  text-align: center;
}

footer .mod_help dl dt {
  font-size: 16px;
  color: #333;
  margin-bottom: 13px;
}

footer .mod_help dl dd {
  font-size: 12px;
  line-height: 21px;
  color: #333;
}

/* 找到 最后一个dl里面的最后一个dd设置样式 */
footer .mod_help dl:last-child dd:last-child {
  margin-top: 8px;
}

/* 版权 */
footer .mod_copyright {
  text-align: center;
  padding-top: 20px;
}

footer .mod_copyright .links {
  width: 1035px;
  height: 12px;
  margin: 0 auto;
  line-height: 12px;
}

footer .mod_copyright .links li {
  float: left;
  padding: 0 16px;
  border-right: 1px solid #999;
}

footer .mod_copyright .links li:last-child {
  border-right: none;
}

footer .mod_copyright .copyright {
  margin-top: 17px;
}
/* footer 模块结束 */
